<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />

<link href='../fullcalendar.min.css' rel='stylesheet' />
<link href='../fullcalendar.print.min.css' rel='stylesheet' media='print' />
<style type="text/css">
	
.fc-toolbar.fc-header-toolbar {
	background: #3bb4f2;
    color: #fff;
	margin-bottom: 0em;
}

.fc-next-button{
	background: #3bb4f2;

}
.fc-state-default {
	background: #3bb4f2;
	border-color: #3bb4f2;
	color: #ffffff;
	text-shadow: 0 0px 0px rgba(255, 255, 255, 0);
	box-shadow: inset 0 0px 0 rgba(255, 255, 255, 0), 0 0px 0px rgba(0, 0, 0, 0);
}
</style>

<script src='../lib/moment.min.js'></script>
<script src='../lib/jquery.min.js'></script>
<script src='../fullcalendar.min.js'></script>
<script src='../locale/zh-cn.js'></script>
<script>

	$(document).ready(function() {
		//日历初始化设置
		$('#calendar').fullCalendar({
		header: {
        left: 'prev',
        center: 'title',
        right: 'next'
      },
      navLinks: true,
      contentHeight:50,
      navLinkDayClick: function(date, jsEvent) {
	        console.log('day', date.format('YYYY/MM/DD')); // date is a moment
	        // console.log('coords', jsEvent.pageX, jsEvent.pageY);
	    },
	  eventClick: function(calEvent, jsEvent, view) {
	  	var strdate=calEvent.start._d;
	  	var day = moment(strdate);
        console.log('day',day.format('YYYY/MM/DD'));

    },
      defaultDate: '2014-06-12',
      defaultView: 'basicWeek',
			
		});
	
		//添加日历事项
		$('#calendar').fullCalendar('addEventSource',{	
		events: [
				{
					title: '',
					start: '2017-07-10'
				},
				{
					title: '',
					start: '2017-07-13'
				}
			]
		});
		//设置当前日期
		$('#calendar').fullCalendar('gotoDate',{	
		defaultDate:moment()
			
		});
	});


</script>

</head>
<body>

	<div id='calendar'></div>

</body>
</html>
